<template>
 <div class="add_problem">
     <div>
         <mt-field  placeholder="请输入报名填写项" v-model="sentData.questions[problemIndex].Question"></mt-field>
     </div>
     <p>候选项</p>
     <div class="answer">
        <mt-field  placeholder="请输入选项" v-model="sentData.questions[problemIndex].QuestionItem[index].Item"  v-for="(item,index) in sentData.questions[problemIndex].QuestionItem">
          <div  v-bind:class="[index===sentData.questions[problemIndex].QuestionItem.length-1?' icon-tianjia':'icon-jian-copy-copy','add','iconfont']" v-bind:id="index" @click="control($event)"></div>
        </mt-field>
        
     </div>
    <footer>
    <div class="right"  @click="cancle">
       <div class="iconfont icon-kefu"></div>
       <div class="word">取消</div>
    </div>
    <div class="left" @click="savaData">
      <div class="iconfont icon-baoming1" ></div>
      <div class="word">提交</div>
    </div>
  </footer>
 </div>

</template>
<script>

 let sentData = JSON.parse(sessionStorage.PublishInit)


  export default{
    data(){
      return {
        sentData:'undefine',
        problemIndex:'',

    
        
      }
    },

    created(){
    console.log(this.$router)
    this.sentData = JSON.parse(sessionStorage.PublishInit)
    this.problemIndex=sessionStorage.EProblemIndex;
    console.log(this.sentData.questions[4])
   
    },

    methods:{
       control(event){   
           if(event.currentTarget.id==this.sentData.questions[0].QuestionItem.length-1){
              this.sentData.questions[0].QuestionItem.push({ Item: '' });
            
           }else{
             this.sentData.questions[0].QuestionItem.splice(event.currentTarget.id,1)
           }
           
       },
         savaData(){
        
    
         alert(11);
            sessionStorage.PublishInit=JSON.stringify(this.sentData);
        
          this.$router.push({ path: '/event_publish'})
       },
       cancle(){
          this.$router.push({ path: '/event_publish'})
       }
    }
  }
</script>
<style scoped lang="stylus">
   @import './icon/iconfont.css';
   .answer
    .icon-jian-copy-copy
      color red
      font-size 18px
    .icon-tianjia
      font-size 18px
</style>

<style  scoped lang="stylus">
   .add_problem  
     .mint-cell
        min-height 45px
      
       
        input 
          font-size 15px
          padding-left 15px
        .mint-cell-wrapper
          padding 0 0
         
      p
        font-size 15px
        margin 13px 15px 4px 15px

    .mint-cell-value
      // position relative
      .add
        // position absolute
        margin-right 15px

    footer
    display flex
    position fixed
    bottom 0
    width 100%
    height 50px
   
    .right
      flex 2
      background-color  #E5E5E5
      display flex
      justify-content center
      align-items center
      .word
        font-size 12px
        text-align center
       
    .left
      flex 3
      background-color #2A96F5
      display flex
      align-items center
      display flex
      justify-content center
      align-items center
      .word
        font-size 12px
        text-align center
        color: #ffffff;



</style>



